[.NET] SPA 安全整合 SignalR:以 PKCE 三階段換票與 CSP 聯防打造的安全防線

在 SPA 架構下,整合 ASP.NET Core SignalR 常面臨安全挑戰。由於瀏覽器的 WebSocket 握手階段無法自訂 Headers,開發者常被迫將 JWT 放入 Query String 傳遞,使 Token 暴露於 URL 中。此外,一旦 SPA 遭遇 XSS 漏洞,記憶體中的憑證仍有被竊取的風險。
本文將介紹如何以 PKCE (Proof Key for Code Exchange) 三階段換票機制安全換取 30 秒短效 Hub Token,並結合 CSP (Content Security Policy)
聯防作為最後防線,從後端配置一路講到前端原生 JavaScript 整合,為 SignalR Hub 提供全方位的安全防護。

...繼續閱讀 »

[Security] AI Agent 時代的數位鑰匙防護:如何安全管理你的 API 金鑰與授權憑證

隨著 AI Agent 的興起,我們開始授權 AI 代理人存取各種外部服務。但這也帶來了全新的安全隱憂:如果你還習慣把 API 金鑰寫死在程式碼裡,或是隨便丟在 .env 檔,AI Agent 在讀取檔案或執行時,很有可能不小心把金鑰內容外流,等同於將系統的主控權拱手讓人,暴露在外洩的巨大風險中。

...繼續閱讀 »

在 8GB VRAM 筆電讓 Claude Code 串接 Gemma 4 E4B:Ollama + LiteLLM 完整踩坑紀錄

最近 Google 釋出了 Gemma 4 系列,其中 gemma4:e4b 是專為本機與一般電腦設計的版本,4.5B 有效參數,理論上筆電可以跑。我想說趁這個機會,把 Claude Code 的推論後端換成地端,省點 API token,結果跑得很累 XDD。最後發現「跑得起來」跟「能正常工作」是兩件完全不同的事。這篇就是把整個踩坑過程記下來,包含架構設計、VRAM 預算計算、為什麼一定要加 LiteLLM、以及 Claude Code 的 token 結構分析。

...繼續閱讀 »

[Security] SPA 如何用 PKCE + CSP 防止 Token 被竊

SPA 做身分驗證,一定要面對一個問題:**Token 要存在哪?** Authorization Code Flow + PKCE(RFC 7636)是目前的標準做法,解決的是「授權碼在傳輸途中被攔截後,攻擊者拿去換 Token」的問題。搭配 CSP(Content Security Policy)從瀏覽器端限制腳本來源,這兩道防線合在一起,才算是比較完整的 SPA 安全架構。 這篇文章用 ASP.NET Core Web API 自己實作授權伺服器,從頭走完整個 PKCE 流程,包含帳密驗證、Session Cookie 持久化,以及受保護的 API 端點。

...繼續閱讀 »

Hermes Agent × OpenWebUI × ngrok 從零到外網可用的完整演練

最近在玩 NousResearch 推出的 Hermes Agent,覺得 CLI 用起來還是不夠舒服,想把對話介面換成 OpenWebUI,又想在手機上也能用,所以順便串了 ngrok 把服務開到外網。

這一篇把安裝、Gateway 設定、OpenWebUI 串接、Hermes 舊對話匯入、ngrok 對外曝光一次整理起來,以後重灌也可以照著做一遍。

...繼續閱讀 »

通過 AI Agent + Obsidian 建立個人知識庫:Karpathy 筆記術實戰

你是否曾讀過一篇文章覺得很重要,但兩週後卻想不起來在哪看過?或者辛苦存了書籤、截圖,一個月後打開卻不知從何看起?更常見的問題是,文章 A 和文章 B 提到了同一個概念,但因為存在不同地方,你根本沒發現它們的關聯。

最近 OpenAI 共同創辦人、前 Tesla AI 總監 Andrej Karpathy 在 X 上分享了解決這個問題的方法,在網路上引起廣大回響。他的作法很簡單:把文章丟給 AI,AI 讀完後自動整理成一個 Wiki 知識庫,包含總結、目錄以及相關概念的連結,全部以 Markdown 檔案的形式存在你的電腦裡。

這篇文章我想要演練「用 Claude Code 建立這套個人知識管理系統」,從環境建置到實際 ingest 文章,一步一步帶大家走過去。

...繼續閱讀 »

Obsidian 基本配置

在軟體工程的開發與日常知識管理中,工具的選擇與工作流的順暢度往往決定了生產力的高低。傳統雲端筆記在切換頁面時常有卡頓感,容易打斷工作心流,且資料受限於第三方伺服器。

Obsidian 憑藉著本地端獨立 Markdown (MD) 檔案的特性,不依賴雲端伺服器,不僅確保了資料安全,其純文字的架構更是與 AI 程式開發工具(如 Claude Code 或 Gemini CLI)完美結合的絕佳載體。本篇文章將紀錄如何建置 Obsidian 基礎環境,透過 GitHub 進行全自動雲端同步,並導入 AI 工具實踐「自動整理」的筆記工作流。

...繼續閱讀 »

透過 Graphify 建立專案知識庫

在使用 AI 輔助開發(如 Claude Code、Copilot、Codex)接手或分析大型專案時,若讓 AI 直接讀取大量檔案,不僅會耗費大量 Token,AI 也容易迷失在細節中。Graphify 橫空出世,落實了 Karpathy 的工作流程,它是一款強大的擴充工具,能將專案內的程式碼、文件、圖片甚至影音,轉換為「可查詢的知識圖譜(Knowledge Graph)」。它能引導 AI 優先閱讀摘要報告,快速掌握系統架構與設計理念,這是我一直想要的阿。

...繼續閱讀 »